<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Three</title>
    <style>
        canvas{
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <script src='https://cdn.bootcss.com/three.js/r83/three.min.js'></script>
    <script>
        (function(){
            const { Scene, PerspectiveCamera, WebGLRenderer, CubeGeometry, MeshBasicMaterial, Mesh } = THREE;

            const scene = new Scene();
            const camera = new PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
            const renderer = new WebGLRenderer();

            renderer.setSize(window.innerWidth, window.innerHeight);
            document.body.appendChild(renderer.domElement);

            const geometry = new CubeGeometry(1, 1, 1);
            const material = new MeshBasicMaterial({color: 0x001a00});
            const cube = new Mesh(geometry, material);

            scene.add(cube);
            camera.position.z = 5;

            const render = () => {
                requestAnimationFrame(render);
                cube.rotation.x += 0.01;
                cube.rotation.y += 0.01;
                renderer.render(scene, camera);
            }

            render();
        })()
    </script>
</body>
</html>